<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>自适应居中的登录框</title>
<style type="text/css">
body, html {
	margin:0;
	padding:0;
	height:100%;
	
	
}
#box {
	width:100%;
	height:100%;
	background:url(images/sky.jpg) no-repeat 0 0;
	background-size:100% 100%;
	/* 开启盒布局 */
	display:-webkit-box;
	display:-moz-box;
	display:box;	
	/* 水平居中 */
	-webkit-box-pack:center;
	-moz-box-pack:center;
	box-pack:center;
	/* 垂直居中 */
	-webkit-box-align:center;
	-moz-box-align:center;
	box-align:center;
}
#box div {
	opacity:0.8;
}
</style>
<body>
<div id="box">
  <div><img src="images/login.png" /></div>
</div>
</body>
</html>
